<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>
<script>
  // Methods 1: 思路：定义一个新数组，并存放原数组的第一个元素，然后将元素组一一和新数组的元素对比，若不同则存放在新数组中。
  function unique(arr) {
    let newArr = [arr[0]];
    for (let i = 1; i < arr.length; i++) {
      let repeat = false;
      for (let j = 0; j < newArr.length; j++) {
        if (arr[i] === newArr[j]) {
          repeat = true;
          break;
        } else {
        }
      }
      if (!repeat) {
        newArr.push(arr[i]);
      }
    }
    return newArr;
  }

  console.log(unique([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
  // 结果是[1, 2, 3, 5, 6, 7, 4]

  //   Methods 2: 思路：先将原数组排序，在与相邻的进行比较，如果不同则存入新数组。
  function unique2(arr) {
    var formArr = arr.sort();
    var newArr = [formArr[0]];
    for (let i = 1; i < formArr.length; i++) {
      if (formArr[i] !== formArr[i - 1]) {
        newArr.push(formArr[i]);
      }
    }
    return newArr;
  }
  console.log(unique2([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
  // 结果是[1, 2, 3,  4,5, 6, 7]

//   Methods 3: 利用对象属性存在的特性，如果没有该属性则存入新数组。
  function unique3(arr) {
            var obj={}
            var newArr=[]
            for (let i = 0; i < arr.length; i++) {
                if (!obj[arr[i]]) {
                    obj[arr[i]] = 1
                    newArr.push(arr[i])
                }   
            }
            return newArr
        }
        console.log(unique2([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
        // 结果是[1, 2, 3, 5, 6, 7, 4]

        // Methods 4: 利用数组的indexOf下标属性来查询。

        function unique4(arr) {
            var newArr = []
            for (var i = 0; i < arr.length; i++) {
                if (newArr.indexOf(arr[i])===-1) {
                    newArr.push(arr[i])
                }
            }
            return newArr
        }
        console.log(unique4([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
        // 结果是[1, 2, 3, 5, 6, 7, 4]

        // Methods 5: 利用数组原型对象上的includes方法。
        function unique5(arr) {
            var newArr = []
            for (var i = 0; i < arr.length; i++) {
                if (!newArr.includes(arr[i])) {
                    newArr.push(arr[i])
                }
            }
            return newArr
        }
        console.log(unique5([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
        // 结果是[1, 2, 3, 5, 6, 7, 4]

        // Methods 6: 利用数组原型对象上的 filter 和 includes方法。
        function unique6(arr) {
            var newArr = []
            newArr = arr.filter(function (item) {
                return newArr.includes(item) ? '' : newArr.push(item)
            })
            return newArr
        }
        console.log(unique6([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
        // 结果是[1, 2, 3, 5, 6, 7, 4]

        // Methods 7: 利用数组原型对象上的 forEach 和 includes方法。
        function unique7(arr) {
            let newArr = [];
            arr.forEach(item => {
                return newArr.includes(item) ? '' : newArr.push(item);
            });
            return newArr;
        }
        console.log(unique7([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
        // 结果是[1, 2, 3, 4, 5, 6, 7]

</script>
